@import "@/common/constants/StyleConst.scss";

.Maintenance-container {
	padding: 8px 16px 16px;

	.Maintenance-head {
		display: flex;
		gap: 13px;
		height: 32px;
		line-height: 32px;
		min-width: 128px;
		margin-bottom: 8px;

		:deep .input-select {
			border-radius: 32px;
			width: 128px;

			.input-selection,
			.input-label {
				color: $color-theme-grey;
				font-weight: 700;
			}

			.v-select__selections {
				position: relative;
				overflow: hidden;

				.input-selection {
					position: absolute;
					left: 50%;
					transform: translateX(-50%);
				}
			}

			.v-label {
				width: 100%;
				text-align: center;
			}

			&.v-text-field.v-text-field--solo .v-input__control {
				min-height: inherit;
			}
		}

		.icon-import-wrap {
			width: 32px;
			height: 32px;
			background-color: $color-theme-lightgrey;
			border-radius: 50%;

			.icon-import {
				font-size: 16px;
				color: $color-theme-blue;

				&::before {
					font-weight: 700;
				}
			}
		}

	}
}

// :deep.v-menu__content {
// 	margin-top: 34px;
// 	margin-left: 12px;
// }

.input-head {
	padding: 0 8px;
	margin-bottom: 8px;
	position: relative;
	height: 28px;

	&-item-btns {
		width: 208px;
		height: inherit;
		overflow: hidden;

		.btn {
			width: 110px;
			height: inherit;
			background-color: #D9D9D9;
			position: absolute;
			font-weight: 700;
			top: 0;

			&:first-child {
				left: 0;
				border: inherit;
				border-top-right-radius: 32px;
				border-bottom-right-radius: 32px;
				z-index: 20;
				opacity: 1;
			}

			&:last-child {
				right: 0;
			}
		}

		.v-item--active {
			background: $color-theme-navy;
			color: $color-text-white;
			z-index: 2;
		}
	}
}